<!--
 * @Date         : 2020-10-28 09:42:58
 * @LastEditors  : zhangyu
 * @LastEditTime : 2020-11-04 15:46:08
 * @Description  : 
-->
<template>
	<div class="table-box">
	<div class="menu-edit">
		<el-page-header @back="goBack" :content="(id?'编辑':'新增')+'菜单'"></el-page-header>
		<el-form ref="form" :model="model" label-width="200px">
			<el-form-item label="菜单名称">
				<el-input v-model="model.title"></el-input>
			</el-form-item>
			<el-form-item label="上级菜单">
				<el-select v-model="model.pid" placeholder="请选择上级菜单">
					<el-option :label="item" :value="(('' + index).trim() == '')?'':parseInt(index)" v-for="(item, index) in parents" v-bind:key="index"></el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="排序权重">
				<el-input v-model="model.sort"></el-input>
			</el-form-item>
			<el-form-item label="菜单状态">
				<el-switch v-model="model.status" :active-value="parseInt(1)" :inactive-value="0"></el-switch>
			</el-form-item>
			<el-form-item label="权限判定节点">
				<el-input v-model="model.node"></el-input>
			</el-form-item>
			<el-form-item label="前端路径">
				<el-input v-model="model.url"></el-input>
			</el-form-item>
			<el-form-item>
				<el-button type="primary" @click="onSubmit">立即{{id?"保存":"创建"}}</el-button>
				<el-button @click="goBack">取消</el-button>
			</el-form-item>
		</el-form>
	</div>
	</div>
</template>

<script>
	
	export default {
		props: {
			id: String
		},
		data() {
			return {
				parents: [],
				model: {
					id:0,
					title: "",
					pid: 0,
					node: "",
					url: "",
					sort: 0,
					status: 1
				}
			}
		},
		async created() {
			let parents = await this.$http.get('menu/parents')
			this.parents = parents
			if(this.id){
				let model = await this.$http.get('menu/detail?id='+this.id)
				this.model = model
			}
		},
		methods: {
			async onSubmit() {
				let url = this.id?"menu/edit":"menu/add"
				await this.$http.post(url,this.model)
				this.$message.success('操作成功')
				this.$router.go(-1)
			},
			goBack(){
				this.$router.go(-1)
			}
		},
	};
</script>

<style scoped>
  
</style>

